<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>请求数据的处理</title>
    <script src="js/jquery-3.2.1.min.js"></script>
    <style>
        .gray{
            background-color: gray;
        }
    </style>
</head>
<body>
<input type="button" value="点我" class="btn">
<div class="ctn">
    <table class="tab">
        <tr>
            <th>学号</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>地址</th>
        </tr>
    </table>
</div>
<script>
    $(".btn").click(function () {
        //发送请求获取数据
        //testall
        $.ajax({
            url:"http://172.16.16.63:8081/testall",
            success:function (re) {
                  console.log(re);
                  for (var i = 0; i < re.result.length; i++) {
                      var idTD = $("<td></td>").html(re.result[i].sid);
                      console.log(re.result.sid);
                      var snameTD = $("<td></td>").html(re.result[i].sname);
                      var ageTD = $("<td></td>").html(re.result[i].age);
                      var addressTD = $("<td></td>").html(re.result[i].address);
                      if (i%2!=0){
                          $("<tr class='gray'></tr>").append(idTD)
                              .append(snameTD)
                              .append(ageTD)
                              .append(addressTD)
                              .appendTo(".tab")
                      }else {
                          $("<tr></tr>").append(idTD)
                              .append(snameTD)
                              .append(ageTD)
                              .append(addressTD)
                              .appendTo(".tab")
                      }

                  }


            }
        })
    })
</script>
</body>
</html>